Blogdown 简介

本课程会讲解如何使用R markdown 和Hugo创建网页。这样做有几个好处：

其是一个静态网页，网页只包含静态文件，网站不需要向PHP这样的服务器端脚本或者数据库。
网站通过Rmarkdown文档生成，这带来的巨大的好处，如果数据分析使用的是R相关的编程，网站中的分析结构都可以直接从R代码计算而得。
通过本课程的学习，同学们可以轻易的开发博客，展示自己的数据分析结果

1.1 本课程的结构

1.简介
2.准备工作
3.构建Blog
4.部署发布
5.延伸

准备工作与安装指南

首先需要的是安装R和Rstudio，这里默认同学们都已经安装好了。然后需要从CRAN安装Blogdown包：

install.packages('blogdown')

或者从Github进行安装:

if (!requireNamespace("devtools")) install.packages("devtools")
devtools::install_github("rstudio/blogdown")

其次，blogdown是基于静态网站生成器Huge，因此还需要安装Hugo：

blogdown::install_hugo()

如果需要升级或者重新安装Hugo，可以使用:

blogdown::update_hugo()

构建Blog

Hugo的文档对于初学者来说是有一点令人生畏，本课程也不希望探讨太多的技术细节，本课程的目的是希望帮助更多的同学能够使用这样一门工具。

3.1 创建一个新项目
打开Rstudio，创建一个新的项目：

（File -> New Project)

然后在Rstudio中输入：

blogdown::new_site()

然后等待此功能创建一个新站点，下载默认的主题，添加一些事例。并且可以在Rstudio中的Viewer中进行预览：

image.png

image.png

接下来我们会介绍几个主要的目录和文件的具体含义：

配置文件config.toml,在其中可以指定一些全局参数。我们打开此文件可以看到：

baseurl = "/"
languageCode = "en-us"
title = "A Hugo website"
theme = "hugo-lithium"
googleAnalytics = ""
disqusShortname = ""
ignoreFiles = ["\\.Rmd$", "\\.Rmarkdown$", "_files$", "_cache$"]

[permalinks]
    post = "/:year/:month/:day/:slug/"

[[menu.main]]
    name = "About"
    url = "/about/"
[[menu.main]]
    name = "GitHub"
    url = "https://github.com/rstudio/blogdown"
[[menu.main]]
    name = "Twitter"
    url = "https://twitter.com/rstudio"

举一个最简单的例子就是修改网站的标题。对于全局参数我们需要关注的并不是很多，另外需要注意的是menu.main添加的是网页的

内容目录content/，可以在这个目录下写R

发布目录，public/，网站会生成到这个目录，这个目录下面包含大量的html和css，js文件

static/目录，这个目录会保存一些静态文件，比如会用到的图片和数据

选择主题

在Hugo中，主题控制者页面的整体外观和功能。想要知道有哪些可以选择的主题，可以在：https://themes.gohugo.io/进行查看。

选择处自己满意的主题之后，需要弄清楚这个主题的Github用户名和储存酷的名字，然后通过

进行安装。或者在创建博客的时候给new_site()传递theme参数举个例子：

image.png

选择第一个主题，点击进去：

image.png

点击homepage查看用户名和储存库名字，然后进行下载：

blogdown::install_theme("luizdepra/hugo-coder")

或者创建一个新的站点：

blogdown::new_site("luizdepra/hugo-coder")

推荐几个常用的主题：

1. 简洁的主题：

• XMin https://github.com/yihui/hugo-xmin
• Tanka https://github.com/road2stat/hugo-tanka
• ghostwriter https://github.com/jbub/ghostwriter

2. 复杂的主题

• hugo-academic https://github.com/gcushen/hugo-academic
• hugo-tranquilpeak-theme https://github.com/kakawait/hugo-tranquilpeak-theme
• hugo-creative-portfolio-theme https://github.com/kishaningithub/hugo-creative-portfolio-theme
• hugo-universal-theme https://github.com/devcows/hugo-universal-theme

添加自己的网页

context目录包含了页面所有的源文件，需要添加新的页面只需要在context下面新添加一个markdown文件，添加文件成功之后，使用blogdown::serve_site()重新构建网页

部署

部署blog有很多种方式：

• Netlify
• Github
• GitLab
  本课程介绍的是使用Netlify进行部署

注册Netlify和github

首先，将我们的Blog的项目上川岛Github

登陆Netlify，这里使用的是Github账户进行直接登陆

image.png

创建新网页

image.png

连接你的Github
创建新网页

image.png

部署网页，我们需要部署的内容都在public这个文件夹里面

image.png

点击部署，然后稍作等待，就可以看到部署成功了

image.png

途中的连接就是我们网页的连接，打开链接就可以查看到我们的网页

image.png